<template>
  <div id="echarts2" style="width:100%;height:280px"></div>
</template>

<script>
import { stockUseStatus } from '@/api/dashboard'
import * as echarts from 'echarts/core'
import { TooltipComponent } from 'echarts/components'
import { PieChart } from 'echarts/charts'
import { LabelLayout } from 'echarts/features'
import { CanvasRenderer } from 'echarts/renderers'

echarts.use([TooltipComponent, PieChart, CanvasRenderer, LabelLayout])
export default {
  mounted () {
    this.week()
    // const chartDom = document.getElementById('echarts1')
    // const myChart = echarts.init(chartDom)
    // this.option && myChart.setOption(this.option)
    // console.log(this.option)
  },
  created () {
    // this.week()
  },
  data () {
    return {
      option: {
        color: ['gray', '#ffaa00'],
        tooltip: {
          trigger: 'item',
          formatter: '{b0}: {c0}'
        },
        // legend: {
        //   top: '5%',
        //   left: 'center'
        // },
        series: [
          {
            // top: '0',
            // name: 'Access From',
            type: 'pie',
            radius: ['40%', '60%'],
            avoidLabelOverlap: false,
            label: {
              show: false,
              position: 'center'
            },
            emphasis: {
              // 鼠标移动到项目上,显示在中间的label
              label: {
                show: true,
                fontSize: 10,
                fontWeight: 'bold',
                color: ['gray', '#ffbb00']
              }
            },
            labelLine: {
              show: false
            },
            data: [
              // { value: 1048, name: 'Search Engine' },
              // { value: 735, name: 'Direct' }
            ]
          }
        ]
      }
    }
  },
  methods: {
    async week (type) {
      const { data } = await stockUseStatus()
      // console.log(data)
      this.option.series[0].data = data
      this.option.series[0].data = data
      // console.log(this.option.series[0].data)
      const chartDom = document.getElementById('echarts2')
      const myChart = echarts.init(chartDom)
      this.option && myChart.setOption(this.option)
      // this.option.dataset.source.splice(2, 0, [data.data[1].name, ...data.data[1]])
    },
    month () {},
    year () {}
  }

}
</script>

<style>

</style>
